<template>
  <v-form
    ref="form"
    v-model="valid"
    lazy-validation
  >
  <v-container>
    <v-text-field
      v-model="name"
      :counter="20"
      :rules="nameRules"
      label="群名称"
      required
    ></v-text-field>

    <v-text-field
      v-model="email"
      :rules="emailRules"
      label="机器人地址"
      required
    ></v-text-field>

    <v-select
      v-model="select"
      :items="items"
      label="年级"
      required
    ></v-select>

    <v-btn
      :disabled="!valid"
      color="primary"
      class="mr-4"
      @click="validate"
    >
      新增
    </v-btn>
    </v-container>
  </v-form>
</template>

<script>
  export default {
    data: () => ({
      valid: true,
      name: '',
      nameRules: [
        v => !!v || '请输入群名称',
        v => (v && v.length <= 20) || '群名称不可以超过20个字符',
      ],
      email: '',
      emailRules: [
        v => !!v || '请输入机器人地址',
        v => /^https:\/\/+(oapi)+\.+(dingtalk)+\.+(com)+/.test(v) || '机器人地址格式有误',
      ],
      select: null,
      items: [
        '一年级',
        '二年级',
        '三年级',
        '四年级',
        '五年级',
        '六年级',
        '初一',
        '初二',
        '初三',
        '高一',
        '高二',
        '高三',
        '其他'
      ],
    }),
    created(){
      console.log(this)
      //this.getRobot(this.$Global.phone,'getRobot');
    },
    methods: {
      validate () {
        this.$refs.form.validate();
        //console.log(this.$Global.api)
        if(this.email&&this.name){
            //console.log(1);
            this.addRobot(this.$Global.phone,this.name,this.email,this.select,'addRobot');
        }
      },
      getRobot(phone,method){
          var url = this.$Global.api;
          var requireData = {phone:phone,method:method};
          console.log(requireData);
          this.$axios.post(url,requireData)
          .then(res => {console.log(res)})
          .catch(function (error) { // 请求失败处理
            console.log(error);
          });
      },
      addRobot(phone,name,webhook,grade,method){
          var url = this.$Global.api;
          var requireData = {phone:phone,name:name,webhook:webhook,grade:grade,method:method};
          console.log(requireData);
          this.$axios.post(url,requireData)
          .then(res => {console.log(res);alert('添加成功');})
          .catch(function (error) { // 请求失败处理
            console.log(error);
          });
      },
    },
  }
</script>